<template>
	<view class="pr">
		<view class="mask-box df aic jcc" v-if="lab.platformGoodsSpecMix[0].activityOver==1">
			<image src="https://zhaimeibianli.oss-cn-hangzhou.aliyuncs.com/house/2024/07/02/9160aef09b58405187b363e26668688e.png" mode="widthFix" style="width: 141rpx;height: 111rpx;"></image>
		</view>
		<view class="cert-box-item df  mb20">
			
			<u-image @click="handleDetail(lab,itemIndex,index)" :src="lab.platformGoodsSpecMix[0].image&&lab.platformGoodsSpecMix[0].image.split(',')[0]" width="240"
				height="240" borderRadius="10">
			</u-image>
			<view class="ml20 ">
				<view @click="handleDetail(lab,itemIndex,index)" class="title u-line-2 df aic ">
					{{lab.platformGoodsSpecMix[0].customGoodsName}}
				</view>
				<view class="mt10 df aic jcsb" @click="handleDetail(lab,itemIndex,index)">
					<view class="mt5 fs24 c6 dtsb">
						{{lab.platformGoodsSpecMix[0].specName}}
					</view>
				</view>
					<view class="mt5 fs24 c6 " @click="handleDetail(lab,itemIndex,index)">
						{{lab.introduce||'--'}}
					</view>
				
				<view class="df aic ">
					<view style="width: 285rpx;">
						<u-line-progress active-color="#EF2929" :show-percent="false" inactive-color="#ef292966" height="16" :percent="((lab.platformGoodsSpecMix[0].activitySaleNum||0)/(lab.platformGoodsSpecMix[0].activitySaleStock||0))*100"></u-line-progress>
					</view>
					<view class="fs20 price ml15">
						已售{{lab.platformGoodsSpecMix[0].activitySaleNum||0}}份
					</view>
				</view>
				<div class="df aic">
					<view class="tag ">
						每单省￥{{mulPrice(lab.platformGoodsSpecMix[0])}}
					</view>
					<view class="tag_xg mr16" v-if="lab.platformGoodsSpecMix[0].limitNum">
						限购{{lab.platformGoodsSpecMix[0].limitNum||0}}份
					</view>
				</div>
				<view class=" df aic jcsb mb10 " style="width: 396rpx;" >
					<view class="price-box pr " @click="addGoods" v-if="TOKEN">
						<!-- 已开启 -->
						<image v-if="lab.isStart==0&&lab.platformGoodsSpecMix[0].activityOver!=1" src="https://zhaimeibianli.oss-cn-hangzhou.aliyuncs.com/house/2024/07/04/3db64755267c4484b5fe2b79d4efb3cb.png" class="buy-img"></image>
						<!-- 已关闭-->
						<image  v-if="lab.isStart==1||lab.platformGoodsSpecMix[0].activityOver==1" src="https://zhaimeibianli.oss-cn-hangzhou.aliyuncs.com/house/2024/07/05/fff1725a645141e1be1e456dfe510eed.png" class="buy-img"></image>
						<view class="pr price-info">
							<text class=" fwb" >￥{{lab.platformGoodsSpecMix[0].platformPrice||'0.00'}}</text><text class="fs24"></text>
							<text class=" fwb old-price ml10 fs24" >￥{{lab.platformGoodsSpecMix[0].initPlatformPrice||'0.00'}}</text>
						
						</view>
					</view>
					<view class="price-box u-skeleton-fillet df " @click="$emit('login')" v-else>
						<text class="price fwb ">登录可见价格</text>
					</view>
					<view style="height: 50rpx;padding-top: 14rpx;">
						<u-badge v-if="lab.platformGoodsSpecMix[0].purNum" class="mt15" :absolute="false" :count="lab.platformGoodsSpecMix[0].purNum"></u-badge>
					</view>
				</view>
			</view>
		
		</view>
	</view>
</template>

<script>
	import Decimal from 'decimal.js'
	export default {
		props: {
			lab: {},
			index:0
		},
		methods:{
			mulPrice(item){
				let _price = new Decimal(item.initPlatformPrice||0).sub(item.platformPrice||0)
				return new Decimal(_price).toFixed(2)||'0.00'
			},
			addGoods(){
				if(this.lab.isStart==0&&this.lab.platformGoodsSpecMix[0].activityOver!=1){
					this.$emit('change',this.lab,this.index)
				}
			},
			handleDetail(e){
				uni.navigateTo({
					url:`/pages/goods/detail?id=${e.platformGoodsId}&busType=${e.platformGoodsSpecMix[0].busType}`
				})
			}
		}
	}
</script>
<style lang="scss" scoped>
	.tag {
		padding: 5rpx 10rpx;
		font-size: 22rpx;
		color: white;
		border-radius: 10rpx 0 0 10rpx;
		background: #EF2929;
		display: inline-block;
	}
	.tag_xg{
		padding: 1rpx 10rpx;
		font-size: 22rpx;
		color: #EF2929;
		border-radius: 0rpx 10rpx 10rpx 0;
		border: 2rpx solid #EF2929;
		display: inline-block;
	}

	.cert-box-item {
		background-color: white;
		padding: 20rpx;
		border-radius: 20rpx;
		margin-top: 20rpx;

		&:last-child {
			border-bottom-width: 0;
		}

		.title {
			width: 381rpx;
			font-size: 28rpx;
			font-family: PingFang SC-Bold, PingFang SC;
			font-weight: bold;
			color: #333333;
			line-height: 36rpx;
			// height: 74rpx;
		}

		.price-box {
			color: white;
			.price-info{
				top: 14rpx;
				left: 10rpx;
			}
			>.price {
				color: #EF2929;
				font-size: 30rpx;
				font-family: PingFang SC-Bold, PingFang SC;
			}

			>.unit {}

			.old-price {
				color: white;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				text-decoration: line-through;
			}
		}
	}

	.dtsb {
		font-size: 22rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		color: #48A147;
		line-height: 32rpx;
		box-sizing: border-box;
		padding: 1rpx 10rpx;
		background: #FFF4F0;
		border-radius: 19rpx;
		border: 2rpx solid #48A147;
		margin-bottom: 5rpx;
		text-align: center;
		display: inline-block;
		background: #F0FFF0;
	}

	.one_price_content {
		height: 33rpx;
	}
	.mask-box{
		width: 100%;
		height: 100%;
		position: absolute;
		background-color:rgba(0, 0, 0, .4);
		z-index: 1;
		border-radius: 20rpx;
	}
		
	.buy-img{
		position: absolute;
		top: 0;
		left: 0;
		width: 338rpx;
		height: 53rpx;
		
	}
</style>